<template>
    <div style="height: 100%">
        <wl-content-top>
            <template slot="header">
                <Form :model="formItem" :label-width="80" inline>
                    <FormItem label="公司名">
                        <Input v-model="formItem.company" placeholder="输入公司名称"></Input>
                    </FormItem>
                    <FormItem label="网站">
                        <Input v-model="formItem.site" placeholder="请输入网址"></Input>
                    </FormItem>
                    <FormItem label="邮箱">
                        <Input v-model="formItem.email" placeholder="请输入邮箱"></Input>
                    </FormItem>
                </Form>
            </template>
            <template slot="body">
                <Row>
                    <Col class="lyx-mb10" span="4" v-for="(item,index) in buttonList" :key="index">
                        <Button type="primary" @click="showModelAction(item)">{{item.title}}</Button>
                    </Col>
                </Row>
            </template>
        </wl-content-top>
        <Modal
                v-model="modelShow"
                title="点击要查询的组合方式">
            <Row style="margin-bottom: 10px" v-if="selectShow">
                <Col span="12" style="padding-right:10px">
                    <Select v-model="selectSite" filterable>
                        <Option v-for="(item,index) in siteList" :value="item.value" :key="index">{{ item.name }}
                        </Option>
                    </Select>
                </Col>
            </Row>
            <Row>
                <Col v-for="(item,index) in zhiLingList" :key="index" class="lyx-mb10" span="8">
                    <Button type="primary" @click="openViewPage(item)">{{item.name}}</Button>
                </Col>
            </Row>
            <template slot="footer">
                <Button @click="modelShow=false">取消</Button>
            </template>
        </Modal>
    </div>
</template>

<script>
import { templateAction, createRand } from '@/api/google'
import siteData from '@/mock/data/site'
import { mapActions } from 'vuex'

export default {
  data () {
    return {
      formItem: {
        company: '',
        site: '',
        email: ''
      },
      selectShow: false,
      selectSite: '',
      siteList: [],
      modelShow: false,
      buttonList: [
        { title: '公司简介', id: 1 },
        { title: '成立时间', id: 2 },
        { title: '员工数量', id: 3 },
        { title: '联系方式', id: 4 },
        { title: '信用报告', id: 5 },
        { title: '商业数据', id: 6 },
        { title: '提货单查询', id: 7 }
      ],
      zhiLingList: []
    }
  },
  mounted () {
    this.getTemplateList()
  },
  methods: {
    ...mapActions([
      'setOpenIfreamUrl'
    ]),
    showModelAction (data) {
      let formData = this.formItem
      if (formData.company === '' && formData.site === '' && formData.email === '') {
        this.$Message.error('请至少输入其中一项内容')
        return false
      } else {
        createRand({ form: this.formItem, id: data.id }).then(ret => {
          let data = ret.data
          if (data.errcode === 1001) {
            this.zhiLingList = data.data
            if (this.zhiLingList[0].is_site === '1') {
              this.selectShow = true
              this.siteList = siteData.site1
            } else if (this.zhiLingList[0].is_site === '2') {
              this.selectShow = true
              this.siteList = siteData.site2
            } else {
              this.selectShow = false
            }
          }
        })
        this.modelShow = true
      }
    },
    getTemplateList () {
      templateAction({ pageSize: 100 }, 'get').then(ret => {
        let data = ret.data
        if (data.errcode === 1001) {
          this.buttonList = data.data.results
        }
      })
    },
    goHref (data) {
      if (data.is_site === '1' || data.is_site === '2') {
        data.url = data.url.replace(/###/g, this.selectSite)
        console.log(data.url, 'url')
      }
      this.setOpenIfreamUrl(data.url)
      window.open(data.url)
    },
    openViewPage (data) {
      // const { href } = this.$router.resolve({
      //  name: 'viewPage'
      // })
      this.goHref(data)
      // window.open(href, '_blank')
    }
  }
}
</script>

<style scoped>
    .lyx-mb10 {
        margin-bottom: 10px;
    }
</style>
